<template>
	<view class="bigbox">
		<view class="user_window">
			<view class="user_icon">
				<u-image v-if="is_login" width="150rpx" height="150rpx" 
				:src="userinfo.avatar?userinfo.avatar:''"></u-image>
				<view v-show="!is_login" class="text" @click="login()">点击登录</view>
			</view>
			<view v-show="is_login" >
				<view class="name">{{userinfo.nickname}}</view>
				<view class="user_id">UID:{{userinfo.id}}</view>
				<view class="user_id hidden1">{{userinfo.signature}}</view>
			</view>
		</view>
		
		<navigator v-if="is_login" url="/pages/me/edit" class="edit-box w100 flex flex_jc">
			<view class="edit w710 flex flex_ac flex_jc">编辑资料</view>
		</navigator>
		
		<view class="li_box">
			
			<view @click="goMycardList()" class="li">
				<u-image width="50rpx" height="50rpx" src="/static/images/kapai.png"></u-image>
				<view class="text">我的卡牌</view>
				<u-badge numberType="overflow" :type="type" max="99" :value="follow_count" bgColor="red"></u-badge>
			</view>
			
			<view @click="goMycardRecordList()" class="li">
				<u-image width="50rpx" height="50rpx" src="/static/images/thread.png"></u-image>
				<view class="text">卡牌记录</view>
			</view>
			
			<view @click="goSignList()" class="li">
				<u-image width="50rpx" height="50rpx" src="/static/images/sign.png"></u-image>
				<view class="text">签到记录</view>
			</view>
			
		</view>
		<view class="w100 flex flex_jc" v-if="show_ad">
			<ad :unit-id="xcx_ad.video" ad-type="video" ad-theme="white"  v-if="show_ad"></ad>
		</view>
	</view>
</template>

<script>
	import {logout,getUserInfoCount} from "@/api/api"
	export default {
		data() {
			return {
				userinfo:[],
				is_login:false,
				interaction_count:0,
				follow_count:0,
				is_designer:0,
				xcx_ad:getApp().globalData.xcx_ad,
				show_ad:getApp().globalData.show_ad,
			}
		},
		
		
		onLoad: function (option) {
				  
		},
		onShow:function(){
			this.userinfo = uni.getStorageSync('userinfo')?uni.getStorageSync('userinfo'):[],
			this.is_login = uni.getStorageSync('is_login')?uni.getStorageSync('is_login'):false
	
		},
		
		onPullDownRefresh() {
			uni.stopPullDownRefresh();
		},
	
		methods:{
			

			
			goMycardList(){
				if(this.isLogin()){
					uni.navigateTo({
						url: '/pages/ukapai_list2/index',
					});
				}
			},
			
			goMycardRecordList(){
				if(this.isLogin()){
					uni.navigateTo({
						url: '/pages/ukapai_record/index',
					});
				}
			},
			
			goSignList(){
				if(this.isLogin()){
					uni.navigateTo({
						url: '/pages/sign_list/index',
					});
				}
			},
			
			
			goCollect(){
				if(this.isLogin()){
					uni.navigateTo({
						url: '/pages/collect_list/index',
					});
				}
			},
			
			goInteraction(){
				if(this.isLogin()){
					uni.navigateTo({
						url: '/pages/interaction_list/index',
					});
				}
			},
			
			login(){
				if(this.isLogin()){
					//退出
					logout().then(res=>{
						if(res.code==0){
							//退出成功
							uni.setStorageSync('token','')
							uni.setStorageSync('userinfo','')
							uni.setStorageSync('is_login',false)
							this.userinfo = []
							this.is_login = false
							uni.showToast({
								title: res.msg,
								icon: 'none',
							});
							setTimeout(function(){
								uni.switchTab({
								    url: '/pages/me/index'
								  })
							},1500)
						}else{
							uni.showToast({
								title: res.msg,
								icon: 'none',
							});
							setTimeout(function(){
								uni.switchTab({
								    url: '/pages/me/index'
								  })
							},1500)
							
						}
						
					})
					
				}
				
			},
			isLogin(){
				if(this.is_login){
					return true
				}else{
					//登录
					uni.navigateTo({
						url: '/pages/login/login',
					});
				}
			}
		
		}
	}
</script>
<style>
	page{background-color: #F5F5F5;}
</style>
<style scoped>
	.edit{height: 80rpx;color: #FFFFFF;font-size: 30rpx;font-weight: bold;border-radius: 10rpx;background-color: #0066ff;margin-top: 30rpx;}
	.bigbox{display: flex;justify-content: center;flex-wrap: wrap;}
	.user_window{width: 700rpx;background-color: #FFFFFF;display: flex;align-items: center;
		border-radius: 10rpx;margin-top: 20rpx;}
	.user_window .user_icon{width: 150rpx;height: 150rpx;border-radius: 20rpx; overflow: hidden;
	border-radius: 30rpx;margin: 20rpx;background-color: #F5F5F5;display: flex;justify-content: center;align-items: center;}
	.user_window .user_icon .text{font-size: 40rpx;color: #999999;width: 100rpx;text-align: center;}
	.user_window .name{color: #303133; font-size: 30rpx;}
	.user_window .user_id{color: #aaa; font-size: 25rpx;margin-top: 10rpx;}
	.li_box{width: 700rpx;display: flex;align-items: center;background-color: #FFFFFF;
	margin-top: 20rpx;flex-wrap: wrap;}
	.li_box .li{height: 100rpx;display: flex;align-items: center;padding: 0 20rpx;width: 700rpx;
	border-bottom: 2rpx solid #F5F5F5;position: relative;}
	.li_box .li .text{line-height: 100rpx;font-size: 30rpx;margin-left: 20rpx;}
	.btn{width: 600rpx;height: 80rpx;background: #0066ff;margin-top: 50rpx;
    line-height: 80rpx;text-align: center;border-radius: 100rpx;
    color: #ffffff;font-size: 35rpx;font-weight: bold;letter-spacing: 10rpx;
	}
</style>